<!DOCTYPE html>
<html ng-app = "MyApp">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>material</title>
	
	<!-- 加载js -->
	
	
	<script type="text/javascript" src = "../bower_components/angular/angular.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-animate/angular-animate.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-aria/angular-aria.min.js"></script>
	<script type="text/javascript" src = "../bower_components/angular-material/angular-material.min.js"></script>
	<!-- <script type="text/javascript" src = "../bower_components/angular-messages/angular-messages.min.js"></script> -->
	<script type="text/javascript" src = "index.js"></script>

	<!-- 样式 -->
	<link rel="stylesheet" type="text/css" href="index.css">
	<link rel="stylesheet" type="text/css" href="../bower_components/angular-material/angular-material.min.css">
</head>
<body >
	
	<!--  -->
	<div ng-controller="AppCtrl" ng-cloak="" class="buttondemoBasicUsage" ng-app="MyApp">
		<md-content>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button>{{title1}}</md-button>
				<md-button md-no-ink="" class="md-primary">Primary (md-noink)</md-button>
				<md-button ng-disabled="true" class="md-primary">Disabled</md-button>
				<md-button class="md-warn">{{title4}}</md-button>
				<div class="label">Flat</div>
			</section>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button class="md-raised">Button</md-button>
				<md-button class="md-raised md-primary">Primary</md-button>
				<md-button ng-disabled="true" class="md-raised md-primary">Disabled</md-button>
				<md-button class="md-raised md-warn">Warn</md-button>
				<div class="label">Raised</div>
			</section>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button class="md-fab" aria-label="Eat cake">
					<!-- <md-icon md-svg-src="img/icons/cake.svg"></md-icon> -->
				</md-button>

				<md-button class="md-fab md-primary" aria-label="Use Android">
					<!-- <md-icon md-svg-src="img/icons/android.svg"></md-icon> -->
				</md-button>

				<md-button class="md-fab" ng-disabled="true" aria-label="Comment">
					<!-- <md-icon md-svg-src="img/icons/ic_comment_24px.svg"></md-icon> -->
				</md-button>

				<md-button class="md-fab md-primary md-hue-2" aria-label="Profile">
					<!-- <md-icon md-svg-src="img/icons/ic_people_24px.svg"></md-icon> -->
				</md-button>

				<md-button class="md-fab md-mini" aria-label="Eat cake">
					<!-- <md-icon md-svg-src="img/icons/cake.svg"></md-icon> -->
				</md-button>

				<md-button class="md-fab md-mini md-primary" aria-label="Use Android">
					/*<md-icon md-svg-src="img/icons/android.svg" style="color: greenyellow;"></md-icon>*/
				</md-button>
				<div class="label">FAB</div>
			</section>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button ng-href="{{googleUrl}}" target="_blank">Default Link</md-button>
				<md-button class="md-primary" ng-href="{{googleUrl}}" target="_blank">Primary Link</md-button>

				<md-button>Default Button</md-button>
				<div class="label">Link vs. Button</div>
			</section>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button class="md-primary md-hue-1">Primary Hue 1</md-button>
				<md-button class="md-warn md-raised md-hue-2">Warn Hue 2</md-button>
				<md-button class="md-accent">Accent</md-button>
				<md-button class="md-accent md-raised md-hue-1">Accent Hue 1</md-button>
				<div class="label">Themed</div>
			</section>

			<section layout="row" layout-sm="column" layout-align="center center" layout-wrap="">
				<md-button class="md-icon-button md-primary" aria-label="Settings">
					<!-- <md-icon md-svg-icon="img/icons/menu.svg"></md-icon> -->
				</md-button>
				<md-button class="md-icon-button md-accent" aria-label="Favorite">
					<!-- <md-icon md-svg-icon="img/icons/favorite.svg"></md-icon> -->
				</md-button>
				<md-button class="md-icon-button" aria-label="More">
					<!-- <md-icon md-svg-icon="img/icons/more_vert.svg"></md-icon> -->
				</md-button>
				<md-button href="http://google.com" title="Launch Google.com in new window" target="_blank" ng-disabled="true" aria-label="Google.com" class="md-icon-button launch">
					<!-- <md-icon md-svg-icon="img/icons/launch.svg"></md-icon> -->
				</md-button>
				<div class="label">Icon Button</div>
			</section>
		</md-content>







		<div>
			<form ng-submit="submit()" ng-controller="AppCtrl" ng-cloak>
				<p>Selected Value: <span class="radioValue">{{ data.group1 }}</span> </p>

				<md-radio-group ng-model="data.group1">

					<md-radio-button value="Apple" class="md-primary">Apple</md-radio-button>
					<md-radio-button value="Banana"> Banana </md-radio-button>
					<md-radio-button value="Mango">Mango</md-radio-button>

				</md-radio-group>

				<hr />

				<p>Selected Value: <span class="radioValue">{{ data.group2 }}</span></p>

				<md-radio-group ng-model="data.group2" class="md-primary">

							<md-radio-button ng-repeat="d in radioData"
							ng-value="d.value"
							ng-disabled=" d.isDisabled "
							ng-class="{'md-align-top-left': $index==1}" >
							{{ d.label }}<br/>
							<span class="ipsum"
							ng-if="$index == 1">
							Duis placerat lectus et justo mollis, nec sodales orci congue. Vestibulum semper non urna ac suscipit.
							Vestibulum tempor, ligula id laoreet hendrerit, massa augue iaculis magna,
							sit amet dapibus tortor ligula non nibh.
						</span>

					</md-radio-button>

				</md-radio-group>

				<p>
					<md-button class="md-raised" ng-click="addItem()" type="button">Add</md-button>
					<md-button class="md-raised" ng-click="removeItem()" type="button">Remove</md-button>
				</p>

				<hr />

				<p style="margin-bottom: 0;">Graphic radio buttons need to be labeled with the <code>aria-label</code> attribute.</p>
				<p style="margin-top: 0;">Selected Avatar: <span class="radioValue">{{ data.group3 }}</span></p>

				<md-radio-group ng-model="data.group3">
					<md-radio-button ng-repeat="it in avatarData"
					ng-value="it.value"
					aria-label="{{it.title}}">
						<md-icon md-svg-icon="{{it.id}}"></md-icon>
					</md-radio-button>
				</md-radio-group>
			</form>
		</div>


		<md-datepicker class=""  ng-model="b" md-placeholder="结束日期" md-hide-icons="calendar" ng-required></md-datepicker>




	
	<div>
		身份证算法校验
	</div>
	<input type="text" name="" id="card">
	<button ng-click="isCard"></button> 


</div>





	<!--
	Copyright 2016 Google Inc. All Rights Reserved. 
	Use of this source code is governed by an MIT-style license that can be foundin the LICENSE file at http://material.angularjs.org/HEAD/license.
-->
</body>



</html>